<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>简途旅行</title>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="wap-font-scale" content="no">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="/old/css/bonus/fetch.scss?__inline" media="screen" title="no_title" charset="utf-8">
</head>
<body style="visibility: hidden;">
<div class="page" id="startup">
    <img src="https://images.simpletour.com/activity/bonus/startupPage.png" alt=""/>
</div>
<div class="page show" id="fetch">
    <div class="page-content">
        <div class="header">
            <img src="https://images.simpletour.com/activity/bonus/header_bg@3x.png" alt=""/>
        </div>
        <div class="content">
            <!--可领取红包-->
            <!--<div class="red_packet">-->
                <!--<img src="https://images.simpletour.com/activity/bonus/packet_open@3x.png" alt=""/>-->
                <!--<a class="receive" data-status="no">立即领取</a>-->
            <!--</div>-->
            <!--倒计时-->
            <!--<div class="countdown">-->
                <!--<img src="https://images.simpletour.com/activity/bonus/countdown_bg@3x.png" alt=""/>-->
                <!--<div class="time-group">-->
                    <!--<div class="t-title">下一波红包倒计时</div>-->
                    <!--<div class="t-content">-->
                        <!--<div class="t-block hour">-->
                            <!--<label>12</label>-->
                            <!--<span>时</span>-->
                        <!--</div>-->
                        <!--:-->
                        <!--<div class="t-block min">-->
                            <!--<label>12</label>-->
                            <!--<span>分</span>-->
                        <!--</div>-->
                        <!--:-->
                        <!--<div class="t-block secs">-->
                            <!--<label>12</label>-->
                            <!--<span>秒</span>-->
                        <!--</div>-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
            <!--has_countdown-->
            <div class="pad">
                <!--活动已结束-->
                <!--<div class="gameOver">-->
                <!--<div class="info">抢红包活动已经结束啦<br/>下次记得赶早哦</div>-->
                <!--<a>去其他地方看看</a>-->
                <!--</div>-->
                <!--活动还没开始-->
                <div class="presell">
                    <div class="info">距活动开始还有<span class="num">1</span>天</div>
                    <a>去其他地方看看</a>
                </div>
                <div class="trumpet">
                    <ul>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了10元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了20元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了30元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了40元的红包</li>
                        <li>11:11&nbsp;&nbsp;&nbsp;&nbsp;135****0520领取了50元的红包</li>
                    </ul>
                </div>
                <form>
                    <div class="tip">请先验证你的手机号,以便红包的发放和兑换</div>
                    <div class="input-group">
                        <input name="mobile" type="text" placeholder="请输入手机号"/>
                        <span class="getCode">获取验证码</span>
                    </div>
                    <div class="input-group">
                        <input name="loginCode" type="text" placeholder="请输入验证码"/>
                        <span class="validate">验证</span>
                    </div>
                </form>
                <div class="rule">
                    <div class="rule-title">
                        <span class="line"></span>
                        <span class="title">活动规则</span>
                        <span class="line"></span>
                    </div>
                    <div class="rule-content">
                        1、红包每日11:00 15:00 20:00准时开启<br/>
                        2、红包累计大于50元可申请提现<br/>
                        3、活动日期1.27-2.3<br/>
                        4、红包可兑换截至日期为2017年2月10日<br/>
                        5、本活动最终解释权归“简途旅行”所有
                    </div>
                </div>
            </div>
        </div>
        <div class="footer">
            <a>舌尖上的年味</a>
        </div>
    </div>
</div>
<div class="modal-wrap" id="validate">
    <div class="modal-overlay"></div>
    <div class="modal-dialog">
        <div class="dialog-header">
            请验证手机号
        </div>
        <div class="dialog-content">
            请先验证您的手机,才能将红包放入您的私人口袋哦~
        </div>
        <div class="dialog-footer">
            <a class="confirm">确认</a>
        </div>
    </div>
</div>
<div class="modal-wrap" id="success">
    <div class="modal-overlay"></div>
    <div class="modal-dialog">
        <div class="dialog-header">
            领取成功
        </div>
        <div class="dialog-content">
           厉害了我的哥!<br/>
            您已成功抢到XX元现金红包!
        </div>
        <div class="dialog-footer">
            <a class="confirm">知道了</a>
            <a class="cacel">去逛逛</a>
        </div>
    </div>
</div>
<div class="modal-wrap" id="fail">
    <div class="modal-overlay"></div>
    <div class="modal-dialog">
        <div class="dialog-header">
            领取失败
        </div>
        <div class="dialog-content">
            手慢了,本时段红包被他们抢完了!<br/>
            请关注下一时段的红包哦!
        </div>
        <div class="dialog-footer">
            <a class="confirm">知道了</a>
            <a class="cacel">去逛逛</a>
        </div>
    </div>
</div>
<script type="text/javascript" src="/old/common/js/zepto.min.js"></script>
<script type="text/javascript" src="/js/validate.js"></script>
<script type="text/javascript" src="/old/common/js/base.js"></script>
<script>
    (function (doc, win) {
        var docEl = doc.documentElement,
                resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                recalc = function () {
                    var clientWidth = docEl.clientWidth;
                    if (!clientWidth) return;
                    // 针对uc横竖屏rem html没有重绘的问题
                    var style;
                    if (style = document.getElementById("forhtml")) {
                        style.parentNode.removeChild(style);
                    }
                    style = document.createElement("style");
                    style.id = "forhtml";
                    document.head.appendChild(style);
                    style.appendChild(document.createTextNode("html{font-size:" + 20 * (clientWidth / 320) + "px !important;}"));
                };
        recalc();
        document.body.style.visibility = 'visible';
        if (!doc.addEventListener) return;
        win.addEventListener(resizeEvt, recalc, false);
        doc.addEventListener('DOMContentLoaded', recalc, false);
        var a = document.getElementsByTagName('a');
        for (var i = 0; i < a.length; i++) {
            a[i].addEventListener('touchstart', function () {
            }, false);
        }
    })(document, window);
    $(document).ready(function () {
        //倒计时
        var $countdown = $('.countdown'),$presell= $('.presell');
        if($presell.length){
            $('.presell .num').text(Math.floor((Date.parse('${startDate}')-Date.parse(new Date()))/1000/60/60/24)+1);
        }
        if($countdown.length){
            var year,mon,day,hour,min,secs,tempdate,date,now,h,m,s;
            var $hour = $('.t-block.hour label');
            var $min = $('.t-block.min label');
            var $secs = $('.t-block.secs label');
            var t = setInterval(function(){
                date = new Date();
                now = Date.parse(date);
                year = date.getFullYear();
                mon = date.getMonth()+1;
                day = date.getDate();
                hour = date.getHours();
                min = date.getMinutes();
                secs = date.getSeconds();
                if(hour>=11 && hour<15){
                    tempdate = Date.parse(new Date(year,mon-1,day,15,0,0));
                }else if(hour>=15 && hour<20){
                    tempdate = Date.parse(new Date(year,mon-1,day,20,0,0));
                }else if(hour>=20){
                    tempdate = Date.parse(new Date(year,mon-1,day+1,11,0,0));
                }else if(hour<11){
                    tempdate = Date.parse(new Date(year,mon-1,day,11,0,0));
                }
                h = Math.floor((tempdate-now)/1000/60/60%24);
                m = Math.floor((tempdate-now)/1000/60%60);
                s = Math.floor((tempdate-now)/1000%60);
                if(h<10){
                    h = '0'+h;
                }
                if(m<10){
                    m = '0'+m;
                }
                if(s<10){
                    s = '0'+s;
                }
                $hour.text(h);
                $min.text(m);
                $secs.text(s);
            },1000);
        }
        //循环播放
        var $first, $ul = $('.trumpet ul'),$li = $('.trumpet ul li');
        if ($ul.length && $li.length>3) {
            var timer = setInterval(function () {
                if ($first) {
                    $first.appendTo($ul);
                    $first.removeClass('slideup');
                }
                $first = $('.trumpet ul li:first-child');
                $first.addClass('slideup');
            }, 2400);
        }
        //获取验证码
        $('form .getCode').click(function (e) {
            e.preventDefault();
            var $this = $(this);
            var mobile = $.trim($('input[name=mobile]').val());
            if (!$this.hasClass('disabled')) {
                if (!mobile) {
                    $this.removeClass('disabled');
                    $.alert({
                        msg: '手机号不能为空'
                    });
                } else if (/(^0?(13|14|15|17|18)[0-9]{9}$)|(^0[0-9]{9}$)/.test($.trim(mobile))) {
                    $this.addClass('disabled');
                    //发送验证码
                    $.ajax({
                        type: 'POST',
                        url: '/mobile/gateway/activity/wechat/bonus/sendverifycode',
                        data: {mobile: mobile, token: '${loginToken}'},
                        success: function (data) {
                            if (data.code == 0) {
                                var $second = data.data - 1;//返回的倒计时 秒
                                $this.html($second + '秒后重新获取');
                                var t = setInterval(function () {
                                    if (--$second > 0) {
                                        $this.html($second + '秒后重新获取');
                                    } else {
                                        $this.html('重新发送验证码');
                                        $this.removeClass('disabled');
                                        clearInterval(t);
                                    }
                                }, 1000)
                            } else {
                                $this.removeClass('disabled');
                                $.alert({
                                    msg: data.msg
                                });
                            }
                        },
                        error: function () {
                            $this.removeClass('disabled');
                            $.alert({
                                msg: '网络异常,请重试'
                            });
                        }
                    })
                } else {
                    $this.removeClass('disabled');
                    $.alert({
                        msg: '手机号格式错误'
                    });
                }
            }
        });
        //登录验证
        $('form .validate').click(function (e) {
            e.preventDefault();
            var $this = $(this);
            if (!$this.hasClass('disabled')) {
                var mobile = $.trim($('input[name=mobile]').val());
                var loginCode = $.trim($('input[name=loginCode]').val());
                $this.addClass('disabled');
                var $mobile = $.validate.mobile($.trim(mobile));
                var $code = $.validate.loginCode($.trim(loginCode));
                if (!mobile) {
                    $.alert({
                        msg: '手机号不能为空!'
                    });
                    $this.removeClass('disabled');
                } else if (!loginCode) {
                    $.alert({
                        msg: '验证码不能为空!'
                    });
                    $this.removeClass('disabled');
                } else if (!$mobile) {
                    $.alert({
                        msg: '手机号格式错误'
                    });
                    $this.removeClass('disabled');
                } else if (!$code) {
                    $.alert({
                        msg: '验证码格式错误'
                    });
                    $this.removeClass('disabled');
                } else {
                    //提交代码
                    $.ajax({
                        type: 'POST',
                        url: '/mobile/gateway/activity/${type}/bonus/check',
                        data: {account: mobile, vcode: loginCode, token: '${loginToken}'},
                        success: function (data) {
                            if (data.code == 0) {
                                location.replace(data.url);
                            } else {
                                $.confirm({
                                    title: '验证失败',
                                    detail: [data.msg],
                                    yes: '确认',
                                    yesFun: function () {
                                    }
                                });
                                $this.removeClass('disabled');
                            }
                        },
                        error: function (data) {
                            $this.removeClass('disabled');
                            $.alert({
                                msg: '网络异常,请重试'
                            });
                        }
                    })
                }
            }
        });
        //领取红包
        $('a.receive').click(function (e) {
            e.preventDefault();
            var $this = $(this);
            if (!$this.hasClass('disabled')) {
                $.confirm({
                    title: '温馨提示',
                    detail: ['请先验证您的手机，才能将红包放入您的私人口袋哦~'],
                    yes: '确认',
                    yesFun: function () {
                        $this.removeClass('disabled');
                    }
                });
            }
        });
    });
</script>
</body>
</html>